.el-carousel { position: relative; }
.el-carousel--horizontal { overflow-x: hidden; }
.el-carousel--vertical { overflow-y: hidden; }
.el-carousel__container { position: relative; height: 300px; }
.el-carousel__arrow { border: none; outline: 0; padding: 0; margin: 0; height: 36px; width: 36px; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s; border-radius: 50%; background-color: rgba(31, 45, 61, 0.11); color: #fff; position: absolute; top: 50%; z-index: 10; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; font-size: 12px; }
.el-carousel__arrow--left { left: 16px; }
.el-carousel__arrow--right { right: 16px; }
.el-carousel__arrow:hover { background-color: rgba(31, 45, 61, 0.23); }
.el-carousel__arrow i { cursor: pointer; }
.el-carousel__indicators { position: absolute; list-style: none; margin: 0; padding: 0; z-index: 2; }
.el-carousel__indicators--horizontal { bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.el-carousel__indicators--vertical { right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.el-carousel__indicators--outside { bottom: 26px; text-align: center; position: static; -webkit-transform: none; transform: none; }
.el-carousel__indicators--outside .el-carousel__indicator:hover button { opacity: 0.64; }
.el-carousel__indicators--outside button { background-color: #c0c4cc; opacity: 0.24; }
.el-carousel__indicators--labels { left: 0; right: 0; -webkit-transform: none; transform: none; text-align: center; }
.el-carousel__indicators--labels .el-carousel__button { height: auto; width: auto; padding: 2px 18px; font-size: 12px; }
.el-carousel__indicators--labels .el-carousel__indicator { padding: 6px 4px; }
.el-carousel__indicator { background-color: transparent; cursor: pointer; }
.el-carousel__indicator:hover button { opacity: 0.72; }
.el-carousel__indicator--horizontal { display: inline-block; padding: 12px 4px; }
.el-carousel__indicator--vertical { padding: 4px 12px; }
.el-carousel__indicator--vertical .el-carousel__button { width: 2px; height: 15px; }
.el-carousel__indicator.is-active button { opacity: 1; }
.el-carousel__button { display: block; opacity: 0.48; width: 30px; height: 2px; background-color: #fff; border: none; outline: 0; padding: 0; margin: 0; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s; }
.carousel-arrow-left-enter,
.carousel-arrow-left-leave-active { -webkit-transform: translateY(-50%) translateX(-10px); transform: translateY(-50%) translateX(-10px); opacity: 0; }
.carousel-arrow-right-enter,
.carousel-arrow-right-leave-active { -webkit-transform: translateY(-50%) translateX(10px); transform: translateY(-50%) translateX(10px); opacity: 0; }
